import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '@/store/index'
import { checkToken, myActions } from '@/api/login'
Vue.use(VueRouter)

const routes = [
  {
    path: "/",
    redirect: "/login"
  },
  {
    path: '/home',
    name: 'home',
    meta: {
      id: 186,
      nav:["首页"]
    },
    component: () => import("@/views/HomeView.vue"),
    children: [
      {
        meta: {
          id: 4,
          nav:["首页","管理员","权限","角色管理"]

        },
        path: '/Role',
        component: () => import("@/views/RoleManagement.vue"),
      }, {
        meta: {
          id: 5,
          nav:["首页","管理员","权限","管理列表"]
        },
        path: '/GuanLie',
        component: () => import("@/views/GuanLie.vue"),
      }, {
        meta: {
          id: 14,
          nav:["首页","系统设置","Banner管理"]
        },
        path: '/Banner',
        component: () => import("@/views/BanNer.vue"),
      }, {
        meta: {
          id: 20,
          nav:["首页","CMS模块","单页管理"]
        },
        path: '/DanYe',
        component: () => import("@/views/DanYe.vue"),
      }, {
        meta: {
          id:21,
          nav:["首页","CMS模块","公告管理"]
        },
        path: '/GongGao',
        component: () => import("@/views/GongGao.vue"),
      }, {
        meta: {
          id: 1122,
          nav:["首页","商品管理","商品分类"]
        },
        path: '/ShangFeng',
        component: () => import("@/views/ShangFeng.vue"),
      }, {
        meta: {
          id: 78,
          nav:["首页","商品管理","规格尺寸"]
        },
        path: '/GuiGe',
        component: () => import("@/views/GuiGe.vue"),
      }, {
        meta: {
          id: 43,
          nav:["首页","商品管理","商品管理"]
        },
        path: '/ShangGui',
        component: () => import("@/views/ShangGui.vue"),
      },{
        meta: {
          id: 4,
          nav:["首页","管理员","权限","角色管理"]
// 角色管理添加
        },
        path: '/TianJia',
        component: () => import("@/views/TianJia.vue"),
      }
    ]
  },
  {
    path: '/login',
    name: "login",
    component: () => import('@/views/LoginView.vue')
  }
]

const router = new VueRouter({
  mode: "history",
  base: process.env.BASE_URL,
  routes
})
router.beforeEach(async (to, from, next) => {
  // 是否登录
  // 登录是否过期
  // 是否有权限
  let token = sessionStorage.getItem("token")
  // 调用vuex方法获取权限列表
  if (token) {
    // 获取检测的标识---来自于vuex
    if (store.state.check) { //已经检测了
      // 如果登陆了，去的是登录页，就不放行，去home页
      if (to.path == "/login") { //去登陆
        next("/home")
      } else { //去的页面不是登陆
        // 当前路由权限的id，去匹配当前用户的权限组
        // 判断是否有权限
        if (store.state.roles.indexOf(to.meta.id) == -1) { //没有权限
          next("/401")
        } else {
          next()
        }
      }
    } else { //没有检测
      // 如果检验不同，则清除缓存中token，然后退户已登录页
      let res = await checkToken()
      if (res.code === 0) { //检测成功
        store.commit("changeCheck")
        const {
          data: res
        } = await myActions()
        console.log(res);
        store.commit("updateRole", res.map(item => item.id))
        console.log(store.state.roles);
        next()
      } else { //检测失败
        sessionStorage.removeItem("token")
        next("/login")
      }
    }
  } else { //没有登陆
    // 是否去登陆页面
    if (to.path == "/login") {
      next()
    } else {
      // 如果不是登陆页面，就不通过，去登陆页面
      next("/login")
    }
  }
})
export default router
